<script type="text/javascript">
    $(function() {        
        $("a.add").button({
            icons: {
                primary: "ui-icon-plusthick"
            }
        });

        $('.search input[type="submit"]').hide();

        $('#search_keywords').keyup(function(key){
            if (this.value.length >= 1){
                $('#loader').show();
                $.ajax({
                   type: 'post',
                   url: $(this).parents('form').attr('action'),
                   data: { 
                       query: this.value == '' ? '*' : this.value,
                       categories: $('#categories_select').val(),
                       status: $('#select-status').val()
                   },
                   success: function(data){
                       $('#list').html(data)
                       $('#loader').hide();
                   }
                });
            }
        });
        $('select#categories_select').change(function(){
            $('#loader').show();
            $.ajax({
               type: 'post',
               url: $(this).parents('form').attr('action'),
               data: { 
                   query: $('#search_keywords').value == '' ? '*' : $('#search_keywords').value,
                   categories: this.val(),
                   status: $('#select-status').val()
               },
               success: function(data){
                   $('#list').html(data);
                   $('#loader').hide();
               }
            });
        });
        $('#select-status').change(function(){
            $('#loader').show();
            $.ajax({
               type: 'post',
               url: $(this).parents('form').attr('action'),
               data: { 
                   query: $('#search_keywords').value == '' ? '*' : $('#search_keywords').value,
                   categories: $('#categories_select').val(),
                   status: this.val()
               },
               success: function(data){
                   $('#list').html(data);
                   $('#loader').hide();
               }
            });
        });
    });
</script>
<div class="search">
    <form action="<?php echo url_for('candidate_search') ?>" method="post">
        <label>Buscar por nombre o descripción: </label>
        <input type="text" name="query" value="<?php echo $sf_request->getParameter('query') ?>" id="search_keywords" />
        &nbsp;
        <label>Categorías: </label>
        <select multiple="multiple" name="categories" id="categories_select">
            <?php foreach ($categories as $category):?>
                <option value="<?php echo $category->getId()?>"><?php echo $category ?></option>
            <?php endforeach;?>
        </select>
        &nbsp;
        <label>¿Activado?: </label>
        <select name="status" id="select-status">
            <option value="2">Ambos</option>
            <option value="1">Sí</option>
            <option value="0">No</option>
        </select> 
        
        <input type="submit" value="search" />
        <img id="loader" src="/images/loader.gif" style="vertical-align: middle; display: none" />
    </form>
</div>

<?php include_partial('list', array('pager' => $pager))?>

<a class="add" href="<?php echo url_for('candidate_new') ?>">Nuevo Candidato</a>
